<template>
	
		<view class="container">
		<uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" 
			status-bar left-icon="left" left-text="返回"
			title="搜索商品" @clickLeft="back" />
		<uni-search-bar @confirm="search" 
						:focus="true" 
						v-model="searchMap.keyword" @clear="clear">
		</uni-search-bar>
		 <uni-list>
		 	<uni-list-item v-for="goods in goodsList"
			:title="goods.title" 
			:note="goods.tmName" 
			:thumb="goods.defaultImg"
			clickable  
			@click="gotoSkuDetail(goods.id)"
		 	thumb-size="lg" 
			:rightText="goods.price.toString()">
			</uni-list-item>
		</uni-list>
		<view class="uni-pagination-box">
			<uni-pagination show-icon :page-size="pageSize" :current="pageNo" :total="total"/>
		</view>
	</view>
	
</template>

<script>
import searchApi from '../../api/search/search.js'
export default {
	components: {},
	data() {
		return {
			searchMap:{
                keyword:"手机",
                minPrice:0,
                maxPrice:10000,
                sortField:"price",
                sortOrder:"desc",
                tmName:'',
                category3Name:''
            },
            pageNo:1,
            pageSize:10,
            total:0,
            goodsList:[],
		}
	},
	methods:{
		search(res) {
			searchApi.search(this.pageNo,this.pageSize,this.searchMap)
			.then(res=>{
				if(res.data){
					this.total= res.data.total;
					this.goodsList = res.data.goodsList;
					this.tmAggs = res.data.tmAggs;
					this.category3Aggs = res.data.category3Aggs;
				}
			})
		},
		clear(res) {
			uni.showToast({
				title: 'clear事件，清除值为：' + res.value,
				icon: 'none'
			})
		},
		back() {
			uni.navigateBack({
				delta: 1
			})
		},
		gotoSkuDetail(goodsId){
			uni.showToast({
				title: `gotoSkuDetail：${goodsId}`,
				icon: 'none'
			})
			uni.navigateTo({
				url:`/gmall/views/product/skudetail?goodsId=${goodsId}`
			}) 
		}
	}
}
</script>
